<template>
	<div class="page" id="userMainPage">
		<div class="page__bd">
			<div class="weui-tab">
				<div class="weui-tab__panel">
					<div class="weui-tab__panel_top">
						<div class="top_title">
							<p>我的</p>
						</div>
					</div>
					<div class="weui-tab__panel_bd">
						<v-refresh :on-refresh="onRefresh">
							<div class="user_mation">
								<div class="user_photo">
									<img :src="baseurl + userMation.userPhoto" />
								</div>
								<div class="user_text">
									<span class="user_name">{{userMation.userName}}</span>
									<span class="user_sign">{{userMation.userSign}}</span>
								</div>
								<div class="right_click">
									<i class="el-icon-arrow-right"></i>
								</div>
							</div>
							<div class="logout_btn_box">
								<button type="button" class="el-button el-button--danger" @click="logout"><span>安全退出</span></button>
							</div>
						</v-refresh>
					</div>
				</div>
				<div class="weui-tabbar">
					<PublicFoot></PublicFoot>
				</div>
			</div>
		</div>
	</div>
</template>

<script type="text/javascript" src="../assets/js/jquery.min.js"></script>
<script>
	import DropDownRefresh from '@/components/publics/DropDownRefresh'
	import PublicFoot from '@/components/publics/PublicFoot'
	export default {
		name: 'userMainPage',
		data() {
			return {
				userMation: {},
				baseurl: '',
			}
		},
		mounted() {
			this.getStartPullUpState()
			this.getPullUpDefData()
		},
		methods: {
			onRefresh(done) {
				this.getStartPullUpState(),
					this.getPullUpDefData()
				done()
			},
			// 获取上拉加载的初始数据
			getPullUpDefData() {},

			getStartPullUpState() {},
			//退出
			logout() {
				this.$messagebox.confirm('确认注销吗?').then(action => {
					this.$post("/app/post/AppSysUserTokenController/deleteUserMationBySession", {}).then((json) => {
						if(json.returnCode == 0) {
							localStorage.removeItem('appUserToken');
               				localStorage.removeItem(json.bean.id + "-APP");
               				this.$router.push({path: '/login'});
						} else {
							this.$message({message: json.returnMessage});
						}
					});
				}).catch(() => {
                });;
			}
		},
		components: {
			PublicFoot,
			'v-refresh': DropDownRefresh
		},
		created() {
			var token = localStorage.getItem("appUserToken");
			var userMation = JSON.parse(localStorage.getItem(token)); //获取用户信息
			if(this.$util.isEmpty(userMation.userSign)){
				userMation.userSign = '暂无签名';
			}
			this.userMation = userMation;
			this.baseurl = this.NET.BASE_URL;
		}
	}
</script>

<style scoped="scoped">
	
	.user_mation {
		width: 100%;
		float: left;
		height: 120px;
		background-color: #62c9f8;
	}
	
	.user_mation .user_photo {
		width: 50px;
		height: 50px;
		float: left;
		margin-top: 35px;
		margin-left: 15px;
	}
	
	.user_mation .user_photo img {
		width: 100%;
		height: 100%;
		border-radius: 25px;
	}
	
	.user_mation .user_text {
		height: 60px;
    	line-height: 30px;
		margin-left: 10px;
		float: left;
		margin-top: 30px;
		font-size: 18px;
		width: calc(100% - 130px);
	}
	
	.user_mation .user_text .user_name {
		width: 100%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	.user_mation .user_text .user_sign {
		width: 100%;
	    font-size: 12px;
	    margin-top: -5px;
	    float: left;
	    color: white;
	    white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	.user_mation .right_click {
		float: right;
		width: 40px;
		height: 60px;
		line-height: 60px;
		margin-top: 30px;
	}
	
	.logout_btn_box {
		float: left;
		width: 100%;
		margin-top: 25px;
		text-align: center;
	}
	
	.logout_btn_box button {
		width: 90%;
	}
</style>